<!DOCTYPE html>
<html lang="zh-cn">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>管理员登录</title>
  <!-- zui -->
  <link href="/static/zui/css/zui.min.css" rel="stylesheet">
  <link href="/static/zui/lib/bootbox/bootbox.min.css" rel="stylesheet">
  <style>
    body, html{
      width: 100%;
      height: 100%;
    }
    body{
      background: url('http://bing.com/th?id=OHR.SantaElena_ZH-CN8036210800_1920x1080.jpg') no-repeat;
      background-size: cover;
    }
    .panel {
      padding: 0;
      max-width: 300px;
      margin: 10% auto;
    }
    .get_code {
      width: auto;
      padding-right: 2px;
    }
  </style>
</head>

<body>
  <div class="panel">
    <div class="panel-heading">
      <center>管理员登录</center>
    </div>
    <div class="panel-body">
      <div class="input-control has-icon-left">
        <input id="inputAccountExample1" type="text" class="form-control nickname" placeholder="请输入管理员昵称">
        <label for="inputAccountExample1" class="input-control-icon-left"><i class="icon icon-user "></i></label>
      </div>
      <br/>
      <div class="input-control has-icon-left">
        <input id="inputAccountExample1" type="password" class="form-control password" placeholder="请输入密码">
        <label for="inputAccountExample1" class="input-control-icon-left"><i class="icon icon-lock"></i><span class="text-red">*</span></label>
      </div>
      <br/>
      <button class="btn btn-block btn-primary create_user" type="button">确认登录</button>
    </div>
  </div>

  <!-- jQuery (ZUI中的Javascript组件依赖于jQuery) -->
  <script src="/static/js/jquery-1.11.0.min.js"></script>
  <script src="/static/zui/lib/bootbox/bootbox.min.js"></script>
  <!-- ZUI Javascript组件 -->
  <script src="/static/zui/js/zui.min.js"></script>

  <script>
    $('.create_user').click(function () {
      var nickname = $('.nickname').val().trim();
      var password = $('.password').val().trim();

      if (!nickname) {
        new $.zui.Messager('用户名不能为空', { type: 'danger', time: 800 }).show();
        return;
      }
      if (!password) {
        new $.zui.Messager('密码不能为空', { type: 'danger', time: 800 }).show();
        return false;
      }

      var data = {
        nickname, password
      }

      $.post('/admin/login/post', data, function (res) {
        console.log(res)
        if (res.status == 200) {
          new $.zui.Messager('登录成功', { type: 'success', time: 800 }).show();
          setTimeout(function () {
            window.location.replace('/admin')
          }, 800)
        } else {
          new $.zui.Messager(res.message, { type: 'danger', time: 800 }).show();
        }
      })
    })

  </script>
</body>

</html>